*{ padding: 0; margin: 0;}
ul,ol,li{ list-style: none;}
html,body{ height: 100%;}
html{ overflow: hidden;}
body{ font-family: \9ED1\4F53,Arial,Helvetica,Verdana; font-size: 12px; line-height: 1.5;}
img,a{ border: none;}
.media { *zoom: 1; }
.media:after { content: "\20"; display: block; height: 0; clear: both; }
.media .bd { vertical-align: baseline; display: table-cell; width: 10000px; *width: auto; *zoom: 1; }
.media .bd:after { content: "\20"; display: block; height: 0; clear: both; }
.media .bd:first-child { margin-top: 0; }
.media .bd:last-child { margin-bottom: 0; }
.media .bd img { display: block; }
.media .img { float: left; }
.media .img img { display: block; }
.media .imgext { float: right; }
.media .imgext img { display: block; }
a{ color: #333;}
a:active{ outline: none;}
.left{ float:left; display:inline;}
.right{ float:right; display:inline;}
.cf:after { content: '\20'; display: block; height: 0; clear: both; }
.cf { *zoom: 1; }
.clear{ clear: both;}

/*layout*/
.pd_s{ padding: 5px;}
.pd_m{ padding: 10px;}
.pd_l{ padding: 20px;}

.mg_s{ margin: 5px;}
.mg_m{ margin: 10px;}
.mg_l{ margin: 20px;}

.mg_t_s{ margin-top: 5px;}
.mg_t_m{ margin-top: 10px;}
.mg_t_l{ margin-top: 20px;}

.mg_r_s{ margin-right: 5px;}
.mg_r_m{ margin-right: 10px;}
.mg_r_l{ margin-right: 20px;}

.mg_b_s{ margin-bottom: 5px;}
.mg_b_m{ margin-bottom: 10px;}
.mg_b_l{ margin-bottom: 20px;}

.mg_l_s{ margin-left: 5px;}
.mg_l_m{ margin-left: 10px;}
.mg_l_l{ margin-left: 20px;}

.mg_auto{ margin: auto;}

.pd_h_m{ padding-left: 10px; padding-right: 10px;}

.relative{ position: relative;}
.absolute{ position: absolute;}
.h100{ height: 100%;}
.w100{ width: 100%;}
img.block{ display: block;}
.txtC{ text-align: center;}

/*jscrollpane*/
.jspContainer{overflow: hidden;position: relative;}
.jspPane{position: absolute; text-align:left;}
.jspVerticalBar{position: absolute;top: 0;right: 0;width: 6px;height: 100%;}
.jspHorizontalBar{position: absolute;bottom: 0;left: 0;width: 100%;height: 16px;background: red;}
.jspCap{display: none;}
.jspHorizontalBar .jspCap{float: left;}
.jspTrack{ position: relative; background-color: #3c3c3c; border-radius: 10px;}
.jspDrag{ position: relative; background-color: #b21d25; border-radius: 10px; top: 0;left: 0;cursor: pointer;}
.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag{float: left;height: 100%;}
.jspArrow{background: #50506d;text-indent: -20000px;}

/*content*/
.main,.main_inner{ height: 100%; width: 100%;}
.main{ max-width: 1920px; margin: auto;}
.header,
.footer{ height: 50px; width: 100%; position: absolute; top: 0; left: 0; z-index: 11;}
.header{ background: url(../images/header_bg.png) repeat-x left top;}
.header_inner{ background-color: #fff; height: 49px;}
.footer{ background: #fff;}
.header img,
.footer img{ display: block;}
.header .logo_rt{ position: absolute; right: 0; top: 0;}
.footer{ top: auto; bottom: 0;}
.viewboard{ width: 100%; margin: 0 auto; height: 100%; background-color: #ccc;}
.left_view{ width: 25%; float: left; height: 100%; position: relative;}
.right_view{ width: 75%; float: right; height: 100%; position: relative;}
.fc_list { box-sizing: border-box; height: 100%; width: 100%;}
.fc_list li{ width: 100%; float: left; height: 100%; position: relative; z-index: 10; overflow: hidden;}
.right_view .fc_list{ background-color: #e63532;}
.right_view .fc_list li{ width: 33.3333%; cursor: pointer;}
.fc_list li div.img_wrap{ width: 100%; text-align: center; position: absolute; margin:0 auto; top: 50%; left: 0;}
.fc_list li div.doll_wrap{ margin-top: -340px; min-height: 625px;}
.fc_list li.d0 div.doll_wrap{ min-height: 0;}
.fc_list li.active div.doll_wrap{ cursor: pointer;}
.fc_list li.d0{ background-color: #222222;}
.fc_list li.d1{ background-color: #2e98cf;}
.fc_list li.d2{ background-color: #8bd346;}
.fc_list li.d3{ background-color: #e63532;}/*eccc2b*/
.fc_list li.d4{ background-color: #e63532; float: right;}
.fc_list li.d5{ background-color: #e73533;}

.score_txt{ position: absolute; width: 100%; left: 0; bottom: 5%; text-align: center; line-height: 30px; font-size: 12px;}
.score_txt span{ display: inline-block; margin: 0 1%; vertical-align: middle; font-weight: bold;}
.score_txt span.center{ font-size: 30px;}

.main_content{ height: 100%; width: 100%; padding-top: 50px; padding-bottom: 50px; box-sizing: border-box; display: none;}
.main_content_inner{ height: 100%; width: 100%; position: relative; overflow: hidden;}
.loading{ height: 100%; position: relative;}
.loading_slide{ position: absolute; left: 0; top: 50px; width: 100%;}
.loading_bar{ height: 10px; width: 0%; background-color: #000;}
.loading_txt{ line-height: 30px; font-size: 14px; font-weight: bold; padding: 0 20px;}
.loading_page{ height: 100%; display: none;}
body.homepage .loading_page{ display: block;}
.loading_page li.page_item{ height: 100%; display: none;}
.loading_page li.page_item_1{ background-color: #2e98cf; display: block;}
.loading_page li.page_item_2{ background-color: #8bd346;}
.loading_page li.page_item_3{ background-color: #e63532;}
.loading_page li.page_item_4{ background-color: #e63532;}
.loading_page li.page_item img{ display: block; position: absolute; left: 50%; top: 50%; margin-left: -163px; margin-top: -137px;}
.doll_icon_wrap a.icon_link{ width: 33.3333%; display: block; cursor: pointer; margin: 0 auto;}
.doll_icon_wrap img{ width: 100%;}

.menu_bg{ background-color: #fff; filter: alpha(opacity=70);opacity: 0.7; position: absolute; width: 100%; height: 100%; z-index: 98; left: 0; top: 0;}
.memuboard{ position: absolute; left: 0; top: 0; z-index: 99; width: 20%; height: 100%; left: -15%;}
#menu.open{ left: 0; z-index: 999;}
.menu_tigger{ background: url(../images/menu_icon.png) no-repeat left top; height: 51px; width: 51px; position: absolute; left: 78%; top: 3%; cursor: pointer;}
#menu.open .menu_tigger{ background: url(../images/menu_icon.png) no-repeat left bottom;}
.memuboard .menu_inner{ width: 75%; height: 100%; background-color: #000;}
.menu_list{ padding-top: 10%; height: 90%;}
.menu_list li{ height: 59px; cursor: pointer; background-image: url(../images/menu_bg_line.png); background-repeat: no-repeat; background-position: center bottom; padding-bottom: 1px;}
.menu_list li.active{ background-color: #f3d401;}
.menu_list li a{ height: 59px; display: block; overflow: hidden; width: 100%;}
.menu_list li a img{ display: block; margin-top: 0;}
.menu_list li a:hover,
.menu_list li.active a{ background: #f3d401;}
.menu_list li a:hover img,
.menu_list li.active a img{ margin-top: -59px;}
.qlink_bar{ position: absolute; left: 3%; bottom: 3%; z-index: 101;}
.qlink_bar .qlink1{ margin-bottom: 5px;}

.canvas_wrap canvas{ margin-left: 60%;}





/*video*/
.video_list_wrap{ position: relative; width: 100%; height: 100%; overflow: hidden; z-index: 10;}
.video_list li{ width: 100%; float: left; overflow: hidden;}
.video_item{ background-position: center top; background-size: 100%; background-repeat: no-repeat; position: relative;}
.video_item_1{ background-color: #206a90; /*background-image: url(../images/video_bg_1.png);2e98cf*/}
.video_item_2{ background-color: #619331; /*background-image: url(../images/video_bg_2.png);8bd346*/}
.video_item_3{ background-color: #a58e1e; /*background-image: url(../images/video_bg_3.png);a12523*/}
.video_item_4{ background-color: #a12523; /*background-image: url(../images/video_bg_4.png);e63532*/}
.video_item_1 .video_bg{ background-color: #206a90;}
.video_item_2 .video_bg{ background-color: #619331;}
.video_item_3 .video_bg{ background-color: #a58e1e;}
.video_item_4 .video_bg{ background-color: #a12523;}
.video_arr{ background-image: url(../images/video_arr.png); background-position: left top; background-repeat: no-repeat; position: absolute; left: 1%; top: 50%; height: 55px; width: 55px; z-index: 100; cursor: pointer;}
#video_btn_prev:hover,
#video_btn_prev.active{ background-position: left bottom;}
#video_btn_next{ background-position: right top; left: auto; right: 1%;}
#video_btn_next:hover,
#video_btn_next.active{ background-position: right bottom;}

.video_content{ position: absolute; width: 800px; height: 485px; left: 50%; margin-left: -400px; top: 50%; margin-top: -255px; z-index: 11;}
.video_cont{ width:100%; height:450px; position: relative;}
.video_cont video{ background-color: #000; display: block;}
.video_cont .controls{width:100%; height:35px; background:#333; position: absolute; left: 0; bottom: -35px; z-index: 22;}
.video_cont .controls .play_pause_btn{width:6%; height:35px; float:left; cursor:pointer; text-align: center;}
.video_cont .controls .play_pause_btn img{text-align:center; padding-top:8px;}
.video_cont .controls .line{width:1px; height:35px; background:#960; float:left;}
.video_item .model{ position: absolute; left: -240px; top: -20%;}
.video_item .model img{ width: 100%; margin: 0 auto; display: block;}
.video_item .video_bg{ position: absolute; margin: 0 -2.0833%; left: 0; top: 0; width: 104.166%;}
.viewboard_show .video_item .video_bg{ width: 100%; margin: 0;}
.video_item .video_bg img{ display: block; width: 100%;}
.viewboard_show .video_item .video_content{ height: 450px; margin-top: -225px;}
.viewboard_show .video_item .video_cont{ margin-bottom: 0;}
.viewboard_show .video_item .video_bg img{ width: auto; min-width: 1920px; min-height: 1080px; width: 100%;}
.viewboard_show .video_item .tit{ width: 800px; top: 50%; margin-top: -270px; height: 32px; line-height: 22px; font-size: 18px; color: #fff; position: absolute; z-index: 11; left: 50%; margin-left: -400px; text-align: center; font-weight: bold;}
.viewboard_show .video_bg{ position: absolute; left: 0; top: 0; z-index: 9;}

.video_cont .video_cont_inner{ height: 100%;}
.video_cont .video_wrap{ height: 100%;}
.video_cont .video_btn{position:absolute; left:0; top:0; width:100%; height:100%; cursor:pointer; z-index:20; background-image: url(../images/blank.gif);}
.video_cont .video_btn img{position:absolute; top:50%; margin-top:-39px; left:50%; margin-left:-39px;}

.video_cont .progress{float:left; width:70%; height:35px;}
.video_cont .progressBar{position:relative; width:96%; height:8px; background:#999; border-radius:3px; margin: auto; margin-top:13px; overflow:hidden; cursor:pointer;}
.video_cont .timeBar{position: absolute; left:0; top:0; width:0; height:8px; background:#FC0; border-radius:3px;}
.video_cont .bufferBar{ position: absolute; top: 0; left: 0; width: 0; height: 8px; background-color: #ccc;}
.video_cont .time_label{position:relative; width:11%; height:35px; text-align:center; line-height:35px; color:#FC0; font-size:12px; float:left;}
.video_cont .volume{text-align:center; padding-top:8px; float:left; width:6%; cursor:pointer;}
.video_cont .screen{text-align:center; padding-top:8px; float:left; width:6%; cursor:pointer;}
.video_dis{ color: #fff;  filter: alpha(opacity=50); opacity: 0.5; line-height: 14px;}

.video_item .tags{ position: absolute; height:450px; position: absolute; top: 0%; right: -81px;}
.video_item .tag_list{ width: 80px;}
.video_item .tag_list li{ height: 77px; width: 100%; margin-bottom: 1px;}
.video_item .tag_list li div.icon{ background-repeat: no-repeat; background-position: left top; background-image: url(../images/video_icon_1.png); background-size: cover; width: 100%; height: 100%; background-color: #000000; cursor: pointer;}
.video_item .tag_list li div.icon_2{ background-image: url(../images/video_icon_2.png);}
.video_item .tag_list li div.icon_3{ background-image: url(../images/video_icon_3.png);}
.video_item .tag_list li div.icon_4{ background-image: url(../images/video_icon_4.png);}
.video_item .tag_list li:hover div.icon,
.video_item .tag_list li.active div{ background-color: #eccc2b; background-position: right top;}
.video_item .tag_list li div.icon a{ display: block; height: 100%; width: 100%; background-image: url(../images/blank.gif);}
.video_voit{ background-image: url(../images/video_btm_add.png); background-repeat: no-repeat; width: 374px; height: 87px; position: absolute; bottom: 0; left: 50%; margin-left: -187px;}
.video_voit span{ position: absolute; height: 80px; top: 15px; left: 240px; width: 134px; height: 46px; line-height: 46px; font-size: 16px; color: #bbb;}
.video_voit a{ position: absolute; left: 151px; width: 75px; height: 75px; cursor: pointer; background-image: url(../images/blank.gif); background-repeat: no-repeat; font-weight: bold;}

.video_share{ position: absolute; right: 20px; bottom: 10px; z-index: 101;}
.video_share .label{ color: #fff; line-height: 34px;}
.video_share .share_icon{ width: 35px; height: 34px; margin-left: 5px; background-repeat: no-repeat; background-position: left top; cursor: pointer;}
.share_icon_sina{ background-image: url(../images/share_icon_sina.png);}
.share_icon_weixin{ background-image: url(../images/share_icon_weixin.png);}
.qrcode_pop{ width: 167px; position: absolute; right: 0; bottom: 35px; background-image: url(../images/arr_pop.png); background-repeat: no-repeat; background-position: 138px bottom; padding-bottom: 9px;}
.qrcode_pop_inner{ padding: 13px 13px 9px 13px; background-color: #fff;}

body.small .video_item .video_content{ width: 600px; margin-left: -300px; height: 375px; margin-top: -220px;}
body.small .video_item .video_cont{ height: 338px;}
body.small .video_item .model{ left: -226px;}
body.small .video_item .model img{  width: 75%;}
body.small .video_item .tags{  height: 375px; right: -61px;}
body.small .video_item .tag_list{ width: 60px;}
body.small .video_item .tag_list li{ height: 58px; width: 100%; margin-bottom: 1px;}

body.small .viewboard_show .video_item .video_content{ margin-top: -180px;}
body.small .viewboard_show .video_item .tit{ margin-top: -225px; }
body.small #pager{ margin-top: 205px;}

.own_skin{ margin-top: -39px;}
.own_skin .fancybox-skin{ background: none; box-shadow: none;}
.own_skin .fancybox-close{ background-image: url(../images/popbox_close.png); background-repeat: no-repeat; height: 50px; width: 50px; right: -53px; top: 78px;}
.voit_content{ width: 532px; height: 482px; color: #000;}
.voit_content .head{ background-image: url(../images/popbox_head.png); background-repeat: no-repeat; height: 53px; padding-top: 78px; margin-bottom: 3px;}
.voit_content .head .head_inner{ background-color: #eccc2b; height: 53px;}
.voit_content .tit{ text-align: center; font-size: 16px; line-height: 1.4em; padding: 1em 0; font-weight: bold;}
.voit_content .content{ background-color: #eccc2b; height: 348px;}
.voit_content .form_wrap{ width: 374px; margin: auto; font-size: 14px;}
.voit_content .form_wrap .form_item{ line-height: 32px;}
.voit_content .form_wrap .form_item label{ width: 44px;}
.voit_content .form_wrap .form_item input.form_text{ height: 28px; line-height: 28px; padding: 2px; background-color: #000; color: #fff; border: none; width: 290px;}
.voit_content .form_wrap .form_item input.error{ /*border: 2px solid #f00; padding: 0;*/}
.voit_content .form_wrap .form_item_radio{ margin-bottom: 20px;}
.voit_content .form_wrap .form_item_radio label{ width: auto;}
.voit_content .form_wrap .form_item_radio input.form_radio{ margin-top: 8px; margin-right: 3px;}
.voit_content .form_wrap .form_item_radio span{ margin-right: 40px;}
.voit_content .form_wrap .form_item .error_dis{ line-height: 22px; height: 22px; font-size: 12px; color: #f00; margin-left: 44px; clear: left;}
.voit_content .form_wrap .form_item .error_dis span{ display: none;}
.voit_content .form_wrap .error .error_dis span{ display: block;}
.voit_content .form_wrap .form_submit{ width: 290px; display: block; margin-left: 44px; height: 42px; border: 3px solid #000; background: url(../images/btn_arr.png) no-repeat right center; font-size: 16px; cursor: pointer;}

#pager{ position: absolute; width: 800px; left: 50%; margin-left: -400px; top: 50%; margin-top: 280px; text-align: center; z-index: 11;}
#pager li{ display: inline-block; padding: 3px; margin: 0 3px; width: 14px; height: 14px; line-height: 20px; text-align: center; cursor: pointer;}
#pager li span{ display: inline-block; width: 10px; height: 10px; border: 2px solid #f3d401; background: url(../images/blank.gif); border-radius: 10px;}
#pager li.active span{ background: #f3d401;}

.media_wrap{ height: 100%; width: 100%; overflow: hidden; background-color: #000;}
.media_wrap .media_bg{ position: absolute; z-index: 10; left: 0; bottom: 0; width: 100%;}
.media_wrap .soccer{ position: absolute; z-index: 11; width: 747px; height: 90%; max-height: 650px; top: 5%; left: 50%; margin-left: -373px;}
.media_wrap .soccer .img_wrap{ height: 100%;}
.media_wrap .soccer .img_wrap img{ height: 100%; margin: 0 auto;}
.soccer .link_wrap{ position: absolute; z-index: 12; width: 100%; height: auto; left: 0; bottom: 0;}
.soccer .link_img_wrap{ width: 100%; position: absolute; bottom: 0; left: 0;}
.link_img_wrap img{ width: 100%;}
.linklist{ position: absolute; width: 100%; height: 100%; left: 0; bottom: 0; }
.arr_link{ width: 23.8286%; height: 38.3177%; float: left; margin: 0 1.4% 0 0;}
.arr_link a{ width: 100%; height: 70%; margin-top: 20%; display: block; background-image: url(../images/blank.gif); cursor: pointer;}
.arr_link_3,
.arr_link_10{ margin-right: 0;}
.arr_link_4{ margin-left: 12.85%;}
.over_1{ margin-top: -5.7%;}
.arr_link_10 a{ cursor: pointer;}
.arr_link_10 a img{ border: 1px solid #fff; border-radius: 8px;}

/*rules*/
.rule_skin{ margin-top: -15px;}
.rule_skin .fancybox-close{ top: 33px;}
.rule_content{ width: 800px; height: 492px;}
.rule_content .tit{ margin-bottom: 5px;}
.rule_content .tit img{ display: block;}
.rule_content .content{ height: 420px; padding-top: 30px; background-color: #eccc2b;}
.rule_content .rule_scroll_wrap{ height: 380px; width: 748px; margin: 0 auto; overflow: hidden; position: relative;}
.rule_scroll_wrap .img{ position: absolute; right: 0; left: 360px;}
.rule_scroll_wrap .jspTrack{ background-color: #a58e1e;}
.rule_scroll_wrap .jspTrack .jspDrag{ background-color: #000;}

.win_skin{ margin-top: -15px;}
.win_skin .fancybox-close{ top: 33px;}
.win_content{ width: 800px; height: 492px;}
.win_content .tit{ margin-bottom: 5px;}
.win_content .tit img{ display: block;}
.win_content .content{ height: 450px; background-color: #eccc2b;}
.win_content .win_scroll_wrap{ height: 450px; width: 800px; margin: 0 auto; overflow: hidden; position: relative;}

#turnBox{ width: 100%; height: 100%; background: #131313; position: fixed; left: 0; top: 0; z-index: 99999; display: none; opacity: 0.8;}
#turnBox span{ position:absolute; display:block; left:50%; top:50%; margin-left:-243px; margin-top:-168px; width:487px; height:337px;}
#turnBox span img{ width: 100%;}
body.portrait #turnBox{ display: block;}
